import {reactive, toRefs,computed} from 'vue'
import Location from './location'
export default function getTableConfig(props,attr,tbodyWidth){
    let {
        sIndex,
        eIndex,
        scrollRight,
        scrollLeft,
        scrollYDistance,
        scrollXDistance
    } = Location()   // 位置信息
    let tableData = attr.modelValue
    const configMap = reactive({
        checkAll: false,
        selectionRow: [],
        columnLeft:[],
        columnCenter:[],
        columnRight:[],
        showData:[],
        showDataNum:0,
        sortables:{
            order: "", // desc ro asc
            props: "",
            count: 0,
        }
    })    
    const initConfig = function() {
        configMap.showDataNum = Math.ceil(props.height / 50) + 4; //可视区域展示的数据条数
        configMap.showData = tableData.slice(0, configMap.showDataNum); // 初始化数据
        eIndex.value = configMap.showDataNum;
        configMap.columnCenter = props.column.filter((c) => !c.fixed);
        configMap.columnLeft = props.column.filter((c) => c.fixed === "left");
        configMap.columnRight = props.column.filter((c) => c.fixed === "right");
    }

    const initTable = function () {
        let scrollWrapper = document.querySelector(".m-tbody-wrapper");
        let headerView = document.querySelector(".m-header-view");
        // 监听滚动
        scrollWrapper.addEventListener(
            "scroll",
            (e) => {
                // header 同步必须及时同步，不能防抖，否则会偶尔出现错位现象
                let scrollLeft = e.target.scrollLeft; // wrapper X轴滚动距离
                headerView.scrollLeft = scrollLeft; // header同步滚动
                // scrollLeft.value = scrollLeft;
                scrollRight.value = tbodyWidth.value - (Math.ceil(scrollLeft) + e.target.offsetWidth - 17);
                let scrollTop = e.target.scrollTop; // wrapper容器滚动的高度
                scrollYDistance.value = scrollTop - (scrollTop % 50); // tbody需要同步平移wrapper容器滚动的距离
                scrollXDistance.value = scrollLeft
                sIndex.value = Math.floor(scrollTop / 50);
                eIndex.value = sIndex.value+ configMap.showDataNum;
                configMap.showData = tableData.slice(sIndex.value, eIndex.value);
            },
            false
        );
    }
    const initCheckAll = (checkCount)=>{
        const checkAll = document.getElementById("superTableCheckAll");
        configMap.checkAll = checkCount === tableData.length
        if(configMap.checkAll) checkAll.indeterminate = false
        else checkAll.indeterminate = (props.selectionRowCache.size > 0)
    }

    const initData = () => {
        let scrollWrapper = document.querySelector(".m-tbody-wrapper");
        scrollWrapper.scrollTop = 0
        sIndex.value = 0
        eIndex.value = sIndex.value + configMap.showDataNum;
        configMap.showData = tableData.slice(sIndex.value, eIndex.value);
    }
    console.log('attr',attr.onSelectionChange)
    // 是否有选择框
    let hasRowSelection = computed(() =>{
        return (
          Object.prototype.toString.call(attr["onSelectionChange"]) ===
          "[object Function]"
        );
    })



    return {
        ...toRefs(configMap),
        sIndex,
        eIndex,
        scrollRight,
        scrollLeft,
        scrollYDistance,
        scrollXDistance,
        hasRowSelection,
        initConfig,
        initTable,
        initCheckAll,
        initData
    }
}